<template>
  <Card>
    <p slot="title">火灾情况分析表</p>
    <ul class="toolbar" slot="extra">
      <li class="item">
        <Input
          v-model="keyword"
          :search="true"
          size="default"
          enter-button="立即搜索"
          style="width:260px"
          placeholder="输入起火地点名称或起火地址"
        ></Input>
      </li>
    </ul>
    <Table :columns="tableColumns" :data="tableData"></Table>
    <Divider />
    <Page :total="pageCount" show-evalator :page-size="pageSize" @on-change="renderTable"></Page>
    <Spin fix size="large" v-if="loading"></Spin>
  </Card>
</template>

<script>
import echarts from 'echarts'
export default {
  name: "",
  data() {
    return {
      pageCount: 0,
      pageSize: 10,
      loading: false,
      keyword: null,
      tableData: [],
      tableColumns: [
        {
          title: "序号",
          key: "index",
          align: "center",
          width: 80
        },
        {
          title: "起火地点名称",
          key: "fireAlarmName",
          align: "center"
        },
        {
          title: "起火原因",
          key: "fireReason",
          align: "center"
        },
        {
          title: "气象情况",
          key: "weatherSituation",
          align: "center"
        },
        {
          title: "用水告警量",
          key: "waterWarning",
          align: "center"
        },
        {
          title: "用电告警量",
          key: "electricWarning",
          align: "center"
        },
        {
          title: "场所类别",
          key: "placeCategory",
          align: "center"
        },
        {
          title: "相似性隐患地点",
          key: "similiarPlacesName",
          align: "center"
        }
      ]
    };
  },
  mounted() {
      this.renderTable(0);
  },
  methods:{
      renderTable(){
          this.tableData = [];
      }
  }
};
</script>

<style scoped>
</style>